{# SPDX-License-Identifier: Apache-2.0 -#}
{% extends "manage/manage_base.html" %}
{% set user = request.user %}
{% set organizations = user.organizations %}
{% set active_tab = active_tab|default('collaborators') %}
{% block title %}
  {% trans team_name=team.name %}Manage '{{ team_name }}'{% endtrans %}
{% endblock %}
{# Hide mobile search on manager pages #}
{% block mobile_search %}{% endblock %}
{% block content %}
  <div class="tabs-container">
    {% block breadcrumbs %}
      <nav aria-label="{% trans %}Breadcrumbs{% endtrans %}" class="breadcrumbs">
        <ul>
          <li class="breadcrumbs__breadcrumb">
            <a href="{{ request.route_path('manage.organizations') }}">{% trans %}Your account{% endtrans %}</a>
          </li>
          <li class="breadcrumbs__breadcrumb">
            <a href="{{ request.route_path('manage.organization.teams', organization_name=team.organization.normalized_name, team_name=team.normalized_name) }}">
              <i class="fa fa-sm fa-sitemap" aria-hidden="true"></i>
              {{ team.organization.name }}
            </a>
          </li>
          {# Last breadcrumb can be overriden #}
          {% block breadcrumb %}
            <li class="breadcrumbs__breadcrumb">
              <i class="fa fa-users" aria-hidden="true"></i>
              {{ team.name }}
            </li>
          {% endblock %}
        </ul>
      </nav>
    {% endblock %}
    <div class="vertical-tabs">
      <div class="vertical-tabs__tabs">
        <div class="sidebar-section">{% include "warehouse:templates/includes/manage/manage-team-menu.html" %}</div>
      </div>
      <div class="vertical-tabs__panel">
        <!-- mobile nav -->
        <a href="{{ request.route_path('manage.organization.teams', organization_name=team.organization.normalized_name) }}"
           class="vertical-tabs__tab vertical-tabs__tab--with-icon vertical-tabs__tab--mobile vertical-tabs__tab--no-top-border">
          <i class="fa fa-arrow-left" aria-hidden="true"></i>
          {% trans %}Back to teams{% endtrans %}
        </a>
        <div class="vertical-tabs__content">
          <div class="organization-snippet organization-snippet--margin-bottom">
            <h1 class="organization-snippet__title organization-snippet__title--page-title">{{ team.organization.name }}</h1>
            <p class="organization-snippet__description">{{ team.organization.display_name }}</p>
          </div>
          <div class="team-snippet team-snippet--margin-bottom">
            <h1 class="team-snippet__title team-snippet__title--page-title">{{ team.name }}</h1>
            <p class="team-snippet__meta">
              {% trans member_count=team.members|length %}
              {{ member_count }} member
            {% pluralize %}
              {{ member_count }} members
            {% endtrans %}
          </p>
        </div>
        <!-- mobile nav -->
        {% with mode="mobile" %}
          {% include "warehouse:templates/includes/manage/manage-team-menu.html" %}
        {% endwith %}
        {% block main %}{% endblock %}
      </div>
      {% block mobile_tabs_bottom %}{% endblock %}
    </div>
  </div>
</div>
{% endblock %}
